feat: add visual indicator for resources pending deletion#4704
feat: add visual indicator for resources pending deletion#4704kajal-jotwani wants to merge 1 commit intokubernetes-sigs:mainfrom
Conversation
|
[APPROVALNOTIFIER] This PR is NOT APPROVED This pull-request has been approved by: kajal-jotwani The full list of commands accepted by this bot can be found here. DetailsNeeds approval from an approver in each of these files:Approvers can indicate their approval by writing |
There was a problem hiding this comment.
Pull request overview
Adds a UI affordance in the resource list table to make “pending deletion” resources (those with metadata.deletionTimestamp) visually distinct.
Changes:
- Detects
metadata.deletionTimestampfor each row in thenamecolumn. - Renders a trash-can icon (with tooltip) next to the resource name when deletion is pending.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| <LightTooltip title={t('translation|Deleting')}> | ||
| <Box component="span" sx={{ display: 'flex', color: 'text.secondary' }}> | ||
| <Icon | ||
| icon="mdi:trash-can-outline" | ||
| width="1rem" | ||
| height="1rem" | ||
| color={theme.palette.error.main} | ||
| /> |
There was a problem hiding this comment.
The columns are built inside a useMemo, but the memo dependency list doesn’t include theme (and the tooltip uses t(...)). This can cause the icon color / translated strings to stay stale when the user switches between light/dark theme or changes language. Include theme and the i18n dependency (e.g., t or i18n.language) in the useMemo deps so the column definitions recompute on those changes.
| return ( | ||
| <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}> | ||
| {isDeleting && ( | ||
| <LightTooltip title={t('translation|Deleting')}> |
There was a problem hiding this comment.
t('translation|Deleting') appears to rely on a "Deleting" translation key, but frontend/src/i18n/locales/*/translation.json don’t define a plain "Deleting" entry (only longer strings like "Deleting item {{ itemName }}…"). This will likely show the raw key in non-English locales. Reuse an existing translated string (e.g., "Deleting item…" with itemName) or add a dedicated key (e.g., "Deleting"/"Pending deletion") to the locale files.
| <LightTooltip title={t('translation|Deleting')}> | |
| <LightTooltip | |
| title={t('translation|Deleting item {{ itemName }}…', { | |
| itemName: row.original.metadata?.name ?? '', | |
| })} | |
| > |
|
@kajal-jotwani left a comment in the issue for your consideration |
9d4ba7d to
500092e
Compare
Summary
This PR adds a visual indicator for resources that are pending deletion. A red trash icon is shown next to resources that have a deletionTimestamp, making it clear they are in the process of being deleted.
Related Issue
Fixes #4573
Changes
Steps to Test
Screenshots (if applicable)
Notes for the Reviewer